<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/5/21
  Time: 9:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <link rel="icon" type="image/x-icon" href="#"/>
    <link type="text/css" rel="styleSheet" href="${pageContext.request.contextPath}/css/main.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layuiFront/css/layui.css" media="all">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>账号登录</title>


</head>


<body>
<div id="bg">

    <div id="login_wrap">
        <div id="login"><!-- 登录注册切换动画 -->

            <div id="status">
                <i style="top: 0">登录</i>
            </div>
            <span>
                    <form action="#" id="registerform">
                        <p class="form"><input type="text" id="usertel" name="usertel" placeholder="手机号"></p>
                        <p class="form"><input type="text" id="code" name="code" placeholder="请输入验证码"
                                               style="width: 180px">
                            <input type="button" id="cbutton" class="btn" value="获取验证码"
                                   style="width: 120px;height: 30px">
                        </p>
                        <input type="button" value="登录" class="btn" id="loginbtn" style="margin-right: 20px;">
                        <input type="button" value="用户名登陆" class="btn" id="catbtn">
                        <p><a href="register">还没有注册，点这里</a></p>
                    </form>

                </span>
        </div>


        <div id="login_img"><!-- 图片绘制框 -->
            <span class="circle">
                    <span></span>
                    <span></span>
                </span>
            <span class="star">
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                    <span></span>
                </span>
            <span class="fly_star">
                    <span></span>
                    <span></span>
                </span>
            <p id="title">PIGEYE</p>
        </div>
    </div>
</div>
</body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/layuiFront/layui.js" charset="utf-8"></script>
<script>
    layui.use('table', function () {
        var yzm = 000000;
        var table = layui.table;

        //获取验证码点击事件，
        $("#cbutton").click(function () {
            var usertel = $("#usertel").val()
            var myreg = /^[1][3,4,5,6,7,8][0-9]{9}$/;
            console.log(usertel)
            if (usertel === "") {
                layer.tips('手机号码不能为空', '#usertel');
                //alert("测试")
            } else if (!myreg.test(usertel)) {
                layer.tips('请输入正确的手机号码', '#usertel');
            } else {
                $.ajax({
                    type: "post",
                    async: false,
                    data: {"usertel": usertel},
                    url: "code",
                    success: function (message) {
                        layer.tips(message.msg, '#cbutton');
                        yzm = message.code;
                    }
                });

            }
        });
        $("#loginbtn").click(function () {
            var usertel = $("#usertel").val()
            var code = $("#code").val()
            var myreg = /^[1][3,4,5,6,7,8][0-9]{9}$/;
            console.log(usertel)
            if (usertel === "") {
                layer.tips('手机号码不能为空', '#usertel');
                //alert("测试")
            } else if (!myreg.test(usertel)) {
                layer.tips('请输入正确的手机号码', '#usertel');
            } else {
                $.ajax({
                    type: "post",
                    data: {"usertel": usertel, "code": code, "yzm": yzm},
                    async: false,
                    url: "login",
                    success: function (message) {
                        /*layer.tips(message.msg, '#cbutton');*/
                            console.log(message.msg);
                        if (message.msg == "登陆成功") {
                            if (message.userstatus == 0) {
                                window.location.href = "index"
                            }
                            if (message.userstatus == 1 || message.userstatus == 2) {
                                window.location.href = "home";
                            }
                        } else if (message.msg == "请先注册") {
                            //这里应该有一个在页面上给用户的弹窗提醒  提醒用户还没有注册

                            layer.open({
                                title: 'PE影城提示',
                                content: message.msg,
                                btn: ['确定'],
                                yes: function (index, layero) {
                                    window.location.href = "http://192.168.11.229:8080/register.jsp";
                                },
                                cancel: function () {
                                    //右上角关闭回调
                                    window.location.href = "http://192.168.11.229:8080/register.jsp";
                                    //return false 开启该代码可禁止点击该按钮关闭
                                }
                            });

                        } else if (message.msg == "验证码错误") {
                            //这里绑定验证码框的id提醒用户验证码不一致
                            layer.open({
                                title: 'PE影城提示',
                                content: message.msg,
                                btn: ['确定'],
                                yes: function (index, layero) {
                                    layer.close(index)
                                    $("#code").val("")
                                },
                            });
                        } else {
                            //发生不可知异常  弹窗提醒用户登录失败  请重新登录
                            layer.open({
                                title: 'PE影城提示',
                                content: "网络不稳定！！",
                                btn: ['确定'],
                                yes: function (index, layero) {
                                    $("usertel").val("")
                                    layer.close(index)
                                    $("#code").val("")
                                },
                            });
                        }
                    }

                });
            }
        });
        $("#catbtn").click(function () {
            window.location.href = "namelogin"
        })
    })

</script>

</html>
